<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title></title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/jquery.js"></script>
<style>
.pic{ width:120px; height:120px;}
li{ list-style: none; display:block; float:left;  font-size:14px; width:120px; height:180px; overflow:hidden;}


</style>
</head>
<body>
    <div id="wrap">
        <div id="main">
            <div id="news">
                <ul id="txtNewsList">
                    
                </ul>
            </div>
        </div>
    </div>
</body>

<script>
apiready = function() {
    initPage();
    //pull to refresh
    api.setRefreshHeaderInfo({
        visible: true,
        // loadingImgae: 'wgt://image/refresh-white.png',
        bgColor: '#f2f2f2',
        textColor: '#4d4d4d',
        textDown: '下拉刷新...',
        textUp: '松开刷新...',
        showTime: true
    }, function(ret, err){
    	initPage();
    });
    
    //调用下面的返回上一页的函数
		api.addEventListener({
                           name: 'keyback'
                        }, function(ret, err){
                           var js = 'api.historyBack(function(ret, err){if(ret.status){}else{api.closeWidget();}});';
                           api.execScript({
                                           //name:api.winName, 
                               frameName:'frame1',
                               //frameName: api.pageParam.mFrameName,
                               script:js
                           });
                        });
};

function initPage(){

	api.showProgress({
        title: '加载中...',
        modal: false
    });
    
    var html = '';
    api.ajax({
	    //url:'http://www.xinpinghui.com/index.php?m=api',http://www.xinpinghui.com/index.php/api/
	    //url : 'http://news.yongzihao.cn/apicloud/tlist/',
	    url :'http://www.xinpinghui.com/index.php/api/',
	    //method:'get',
	    //timeout: 30,
	    dataType: 'json'
    },function(ret,err){
        	
           if (ret) {

			//alert(ret.length);
            var obj = $api.byId('txtNewsList');
            var len = ret.length;
            for (var i = 0,len = ret.length; i < len; i++) {
				
            	var thisItem = ret[i];
            	//alert(thisItem['id']);
				
            	html += '<li class="item"><a href='+thisItem.android_click_url+'><img class="pic" src='+thisItem.pic_url+' /></a>';
            	html += '<div><a href='+thisItem.android_click_url+'>'+ thisItem.title +'<p>'+ '</p></div></a></li>';
            	
            	//html += '<img src='+thisItem.pic_url+'/>';
            	//html +='/>';
            	//html += thisItem.title+'</li><br>';
            }
			$api.html(obj, html);
			/*
			for(var i=0;i<ret.length;i++){
                       html+= '<br>'+'ID：'+ret[i].id+'<br>'+'title：'+ret[i].title+'<br>'+'pic:'+ret[i].picurl;        
                }
            var obj = $api.byId('txtNewsList');
			$api.html(obj, html);
			*/
			
			api.hideProgress();
			api.refreshHeaderLoadDone();
        } else {
        	
           	alert(JSON.stringify(err));
           	api.hideProgress();
        }
     
    });
    
}
function abc(el){
	api.openWin({
        name: 'name',
        url: 'act_view.html?ID='+el,
        opaque: true,
        vScrollBarEnabled: false
   	 });
   	 	};  
</script>
</html>